<template>
	<view class="">
		<view class="c_input">
			<view class="title">手机号</view>
			<input class="uni-input" focus placeholder="请填写手机号" v-model="phone" />
			<view class="c_btn" @tap="setTimer">
				{{getCodeText}}
			</view>
		</view>
		<view class="c_input">
			<view class="title">验证码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写验证码" v-model="code" />
		</view>
		<view class="c_input">
			<view class="title">密码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填最少8位新密码" type="password" v-model="password" />
		</view>
		<view class="c_input">
			<view class="title">确认密码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写确认密码" type="password" v-model="ispassword" />
		</view>
		<button style="background-color: #8405dc;" @tap="goregist">提交</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: "",
				phone: "",
				code: "",
				password: "",
				ispassword: "",
				info: {},
				getCodeText: "获取验证码"
			}
		},
		methods: {
			setTimer() {
				var that = this;
				if (that.phone == '') {
					uni.showToast({
						title: "请输入手机号",
						icon: "none"
					})
					return false
				}
				if (this.getCodeText == "获取验证码") {
					this.$axios('Sendcode/forgetcode', "POST", 'member', {
						mobile: that.phone
					}, this.$url.state.Edition).then(res => {
						if (res.data.code == 200) {
							let holdTime = 180;
							this.getCodeText = "180秒后获取"
							this.Timer = setInterval(() => {
								if (holdTime <= 0) {
									this.getCodeisWaiting = false;
									this.getCodeBtnColor = "#ffffff";
									this.getCodeText = "获取验证码"
									clearInterval(this.Timer);
									return;
								}
								holdTime--;
								this.getCodeText = "" + holdTime + "秒后获取"
							}, 1000)
						}
					}, (error) => {

					})
				}
			},
			goregist() {
				var that = this;
				if (that.password !== that.ispassword) {
					uni.showToast({
						title: "两次密码输入不一致",
						icon: "none"
					})
					return false
				}
				if (that.password.length < 8) {
					uni.showToast({
						title: "请正确填写最少8位新密码",
						icon: "none"
					})
					return false
				}
				that.$axios('Forget/main', "POST", 'member', {
					mobile: that.phone,
					code: that.code,
					password: that.password
				}).then(res => {
					if (res.data.code == 200) {
						uni.showModal({
							content: '密码重置成功',
							showCancel: false,
							success: function(res) {
								uni.redirectTo({
									url: 'login'
								});
							}
						})
					} else {
						uni.showModal({
							content: res.data.data,
							showCancel: false,
						})
					}
				}, (error) => {

				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #efefef;
	}

	.c_input {
		display: flex;
		align-items: center;
		height: 40px;
		background: #fff;
		font-size: 16px;
		padding: 0 20upx;
		box-sizing: border-box;

		.title {
			width: 160upx;
		}

		input {
			height: 100%;
			margin-left: 20upx;
			flex: 1;
		}

		.c_btn {
			padding: 10upx 20upx;
			background: #C0C4CC;
			font-size: 12px;
		}

		.c_tx {
			width: 50upx;
			height: 50upx;
			margin-left: 20upx;
		}
	}

	button {
		margin-top: 20upx;
	}
</style>
